[MTR04] W2 D3 JS 基礎:陣列、物件與變數


Posted by Christy on 2020-06-21

看影片:JS101「物以類聚:陣列(Array)」到「從 Object 的等號真正的理解變數」

物以類聚:陣列(Array)

  • 陣列第一個元素是零開始,不是一
  • 陣列通常是存性質相同的東西,存很多份
  • 陣列也可以放字串或其他東西

陣列這樣用

var score = [1, 2, 3, 4, 5]
console.log(score)

新增東西到陣列裡面

var score = [1, 2, 3, 4, 5]
score[score.length] =  1000  -> 把 1000 放進去陣列裡面,會在最後一位
score.push(1000) 也是同樣意思,把 1000 放進去
console.log(score)

最直覺的變數型態:物件(Object)

  • 物件的格式是
{
 key: value
}
  • 一個物件就代表一個學生的話
var student = []
var peter = {
 name: 'peter',
 score: 100,
 address: 'tapei city',
 phone: 908390
}
console.log(peter)
  • 如何從物件裡面把東西取出來

console.log(student[o].score) 或是也可以
console.log(peter.score)

沒那麼簡單:變數的運算

ㄧ、型態問題:

  • 如果同時有字串跟數字的話,數字會是相加運算的結果,但字串會是相接的結果
  • 如何把字串轉成數字?
var a = '10' 我是字串
var b = 3    我是數字

console.log(Number(a) + b)  指定 a 是數字

或者是也可以這樣寫

console.log(parseInt(a, 10) + b)  裡面的 10 是十進位的意思

如果是寫其他的像是

console.log(parseInt(a, 2) + b)  裡面的 2 是二進位的意思

10 的二進位就是 2,這樣 a 就變成 2 了

也可以寫成,這樣電腦會自己判斷是十進位
console.log(parseInt(a) + b)
但通常建議還是傳一下十進位
console.log(parseInt(a, 10) + b) 裡面的 10 是十進位的意思

二、浮點數誤差問題

  • 在電腦裡面,有些小數沒辦法被存的很好,例如 0.1 可能會變成 0.1000000003 之類的
  • 所以在做運算的時候數字可能會有誤差,這是所有程式語言都會有的問題
    如果可以盡量不要用到小數,會比較保險

萬年經典題:== 與 ===

一、一個等號是賦值的意思

二、兩個等號是判斷的意思
判斷這兩個東西是否相等

var a = 10  
console.log(a == 10)  
這樣印出來的東西會是 true

程式的執行順序通常是從右到左

三、兩個等號跟三個等號的差別?
差別在形態,三個等號時,會比較左右兩邊的型態;但兩個等號時不會

範例:
console.log(0 == '0') 答案會是 true
console.log(0 === '0') 答案會是 false,因為左邊是數字,右邊是字串

  • 永遠都使用三個等號,這樣有錯比較容易知道

從 Object 的等號真正的理解變數

  • 因為 Js 在判斷的時候,比較的是記憶體位置,所以就算是兩個名稱相同的東西,但實際上他們不是完全一模一樣的
  • 除了最基本的數字型態:數字、字串、布林以外,其他的東西都會是像上述的那個樣子,對物件跟陣列做操作時,要特別注意
  • 箱子裡面放的是記憶體位置,不是直接放那個值。

夏天來了,我又在房間熱得吱吱叫了,但我更擔心的是電腦會燒起來,拜託我的電腦,我會好好善待你的,不要這麼燒。
花了兩天的時間收集資料,之前一直拖延搬家的待辦事項又洞洞洞進展飛速,我每次都這樣,就拖拖拖到好像真的不行了,然後一瞬間把事情都弄完。
在異地生活真的好難,選擇要來魁北克的人是我,當然所有的困難我也都理所當然必須自己承擔。
學習程式的進展有點慢,今天在「從 Object 的等號真正的理解變數」這裡卡了半小時,但我想我已經理解了主要概念,只是有種不確定感,我想我會繼續往下念,因為理解力需要時間來發酵,這裡要做個記號,之後再回來看看。
下週要花更多時間在看影片上面,不然算了一下包含寫作業的時間,這樣下週可能會無法準時交作業。


如果有不能理解的部分,我在筆記的標題就做一個記號好了,這樣我看複習的時候就會記得「是這個地方我還沒完全懂」,就做個驚嘆號的記號好了'!'。










Related Posts

Elevate Your Dermatology Practice with the Electric Dermatology Chair

Elevate Your Dermatology Practice with the Electric Dermatology Chair

Hold Shift to Check Multiple Checkboxes

Hold Shift to Check Multiple Checkboxes

filter 與 interceptor 說明

filter 與 interceptor 說明


Comments